<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>${article.title!''}</title>
	[#include "/theme/adminlte/common/sites.html" /]
	[@header /]
</head>
<!-- ADD THE CLASS layout-top-nav TO REMOVE THE SIDEBAR. -->
<body class="hold-transition skin-blue layout-top-nav">
<div class="wrapper">

	<header class="main-header">
		[@nav  2 /]
	</header>
	<!-- Full Width Column -->
	<div class="content-wrapper">
		<div class="container">
			<!-- Main content -->
			<section class="content">
				<div class="row">
					<section class="col-lg-8">
						<div class="box box-widget">
							<div class="box-header with-border">
								<div class="user-block">
									<img class="img-circle" src="${siteurl}dist/img/user1-128x128.jpg" alt="头像">
									<span class="username"><a href="#">${article.title!""}</a></span>
									<span class="description">${(article.lastDate?string("yyyy年MM月dd日"))!""}</span>
								</div>
							</div>
							<!-- /.box-header -->
							<div class="box-body">
								<div class="pad">${article.contents!""}</div>
								<button type="button" class="btn btn-default btn-xs"><i class="fa fa-share"></i> Share</button>
								<button type="button" class="btn btn-default btn-xs"><i class="fa fa-thumbs-o-up"></i> Like</button>
								<span class="pull-right text-muted">127 likes - 3 comments</span>
							</div>
							<!-- /.box-body -->
							<div class="box-footer box-comments">

								<div class="box-comment">
									<!-- User image -->
									<img class="img-circle img-sm" src="${siteurl}dist/img/user3-128x128.jpg" alt="User Image">

									<div class="comment-text">
									  <span class="username">
										Maria Gonzales
										<span class="text-muted pull-right">8:03 PM Today</span>
									  </span><!-- /.username -->
										It is a long established fact that a reader will be distracted
										by the readable content of a page when looking at its layout.
									</div>
									<!-- /.comment-text -->
								</div>
								<!-- /.box-comment -->
							</div>
							<!-- /.box-footer -->
							[@shiro.authenticated]
							<div class="box-footer">
								<form action="#" method="post">
									<img class="img-responsive img-circle img-sm" src="${siteurl}dist/img/user4-128x128.jpg" alt="Alt Text">
									<!-- .img-push is used to add margin to elements next to floating images -->
									<div class="img-push">
										<input class="form-control input-sm" placeholder="Press enter to post comment" type="text">
									</div>
								</form>
							</div>
							[/@shiro.authenticated]
							<!-- /.box-footer -->
						</div>
					</section>
					<section class="col-lg-4">
						<div class="box box-primary">
							<div class="box-body box-profile">
								<img class="profile-user-img img-responsive img-circle" src="${siteurl}dist/img/user4-128x128.jpg" alt="User profile picture">

								<h3 class="profile-username text-center">Nina Mcintire</h3>

								<p class="text-muted text-center">Software Engineer</p>

								<ul class="list-group list-group-unbordered">
									<li class="list-group-item">
										<b>Followers</b> <a class="pull-right">1,322</a>
									</li>
									<li class="list-group-item">
										<b>Following</b> <a class="pull-right">543</a>
									</li>
									<li class="list-group-item">
										<b>Friends</b> <a class="pull-right">13,287</a>
									</li>
								</ul>

								<a href="#" class="btn btn-primary btn-block"><b>Follow</b></a>
							</div>
							<!-- /.box-body -->
						</div>
						<div class="box box-primary">
							<div class="box-header with-border">
								<h3 class="box-title">About Me</h3>
							</div>
							<!-- /.box-header -->
							<div class="box-body">
								<strong><i class="fa fa-book margin-r-5"></i> Education</strong>

								<p class="text-muted">
									B.S. in Computer Science from the University of Tennessee at Knoxville
								</p>

								<hr>

								<strong><i class="fa fa-map-marker margin-r-5"></i> Location</strong>

								<p class="text-muted">Malibu, California</p>

								<hr>

								<strong><i class="fa fa-pencil margin-r-5"></i> Skills</strong>

								<p>
									<span class="label label-danger">UI Design</span>
									<span class="label label-success">Coding</span>
									<span class="label label-info">Javascript</span>
									<span class="label label-warning">PHP</span>
									<span class="label label-primary">Node.js</span>
								</p>

								<hr>

								<strong><i class="fa fa-file-text-o margin-r-5"></i> Notes</strong>

								<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam fermentum enim neque.</p>
							</div>
							<!-- /.box-body -->
						</div>
					</section>
				</div>

			</section>
			<!-- /.content -->
		</div>
		<!-- /.container -->
	</div>
	<!-- /.content-wrapper -->

	[@footer /]
</div>
<!-- ./wrapper -->

[@scripts /]
</body>
</html>
